//模块导入
import { draw } from './tools.js';
import { APIRegister } from './fetch.js'

let show_num = [];
//验证码渲染
draw(show_num);

//验证码切换
$('#canvas').click(function () {
    draw(show_num);
})


//前端正则判断
$('.layui-btn').on('click', function () {

    let username = $('.user .login-input').val();
    let pwd = $('.pwd .login-input').val();
    let mobile = $('.mobile .login-input').val();

    //用户名判断
    let reg = /^[a-z_$][\w$]{5,9}$/i;
    if (username == '') {
        $('.point').css('display', 'block');
        $('.point span').html('请输入用户名');
        return;
    }
    if (reg.test(username)) {
        //密码判断
        let reg = /^[a-z0-9]{6,12}$/i;
        if (pwd == '') {
            $('.point').css('display', 'block');
            $('.point span').html('请输入密码');
            return;
        }
        if (reg.test(pwd)) {
            //电话号码判断
            let reg = /^[1]\d{10}$/;
            if (mobile == '') {
                $('.point').css('display', 'block');
                $('.point span').html('请输入电话号码');
                return;
            }
            if (reg.test(mobile)) {
                //验证码判断
                let val = $(".input-val").val().toLowerCase();
                let num = show_num.join("");
                if (val == '') {
                    $('.point').css('display', 'block');
                    $('.point span').html('请输入验证码');
                    return;
                }
                if (val != num) {
                    $('.point').css('display', 'block');
                    $('.point span').html('请输入正确的验证码');
                    draw(show_num);
                    return;
                }
                if (val == num) {
                    //协议勾选判断
                    $('.point').css('display', 'none');
                    if ($('#check').prop('checked')) {

                        async function getCode() {
                            let { code, msg } = await APIRegister({
                                username,
                                password: pwd,
                                mobile,
                            })
                            if (code) {
                                layer.confirm('注册成功，立即登录？', {
                                    btn: ['确定', '取消'] //按钮
                                }, function () {
                                    //输入框清空
                                    clear();
                                    location.href = '../../html/login.html'
                                }, function () {
                                    clear();
                                    location.href = '../../index.html'
                                });
                            } else {
                                layer.msg(msg, function () {
                                    draw(show_num)
                                });
                            }
                        }
                        getCode();
                    } else {
                        layer.msg('您需要勾选同意条款才能使用', { icon: 5 });
                    }
                }
                return;
            }
            $('.point').css('display', 'block');
            $('.point span').html('请输入正确的电话号码');
            return;
        }
        $('.point').css('display', 'block');
        $('.point span').html('请输入正确的密码');
        return;
    }
    $('.point').css('display', 'block');
    $('.point span').html('请输入正确的用户名');
})



//tips提示
$('#icon01').on('click', function () {
    layer.tips('请输入由数字字母_$组成的长度6到10位的用户名不能以数字开头', '#icon01');
})

$('#icon02').on('click', function () {
    layer.tips('请输入长度6到12位的数字和字母组成的密码', '#icon02')
})

$('#icon03').on('click', function () {
    layer.tips('请输入常用的手机号', '#icon03')
})

//layui服务条款
$('.msg #service').on('click', function () {
    layer.open({
        type: 2,
        area: ['700px', '450px'],
        fixed: false, //不固定
        maxmin: true,
        content: '../../html/service.html'
    });
})

$('.msg #policy').on('click', function () {
    layer.open({
        type: 2,
        area: ['700px', '450px'],
        fixed: false, //不固定
        maxmin: true,
        content: '../../html/policy.html'
    });
})
 
//输入框清空
export function clear() {
    $('.user .login-input').val('');
    $('.pwd .login-input').val('');
    $('.mobile .login-input').val('');
    $(".input-val").val('');
}